<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" media="screen and (min-width: 400px) and (max-width: 900px)" href="css/01ccc.css">   
		
		<link rel="stylesheet" type="text/css" media="screen and (max-width: 400px) " href="css/02orange.css">  
		<script src="./js/jquery-3.2.0.js"></script>
	</head>
	<body>
		<h1>0000000</h1>
		
		<p>0~400-------orange</p>
		<p>400~900--------#ccc</p>
		<p>900+-------无色</p>

		<hr>

		<span class="ck-file-dialog-button">
			<button class="ck ck-button ck-off" type="button" tabindex="-1"
				aria-labelledby="ck-editor__aria-label_eceb8a4f2ba2d7d91147cff9e3053461f" data-cke-tooltip-text="Insert image"
				data-cke-tooltip-position="s">
				<svg class="ck ck-icon ck-reset_all-excluded ck-icon_inherit-color ck-button__icon" viewBox="0 0 20 20">
					<path
						d="M6.91 10.54c.26-.23.64-.21.88.03l3.36 3.14 2.23-2.06a.64.64 0 0 1 .87 0l2.52 2.97V4.5H3.2v10.12l3.71-4.08zm10.27-7.51c.6 0 1.09.47 1.09 1.05v11.84c0 .59-.49 1.06-1.09 1.06H2.79c-.6 0-1.09-.47-1.09-1.06V4.08c0-.58.49-1.05 1.1-1.05h14.38zm-5.22 5.56a1.96 1.96 0 1 1 3.4-1.96 1.96 1.96 0 0 1-3.4 1.96z">
					</path>
				</svg>
				<span class="ck ck-button__label" id="ck-editor__aria-label_eceb8a4f2ba2d7d91147cff9e3053461f">Insert image</span>
			</button>
			<input class="ck-hidden" type="file" tabindex="-1" accept="image/jpeg,image/png,image/gif" multiple="true"
				data-once="auto-file-upload">
		</span>
		
	</body>
</html>

<script>
		const fileInput = $('input.ck-hidden[type="file"]');

		// Remove any existing change event handlers
		fileInput.on(
			'change',
			// eslint-disable-next-line func-names
			function (event) {
				let files =  event.currentTarget.files;

				console.log(files, 1111111);
				console.log( 'event.currentTarget.files', event );

				// Assuming you want to check the size of the first selected file
				const selectedFile = files[0];

				// Set your maximum file size limit (in bytes)
				const maxSizeInBytes = 1024 * 1024; // 1 MB as an example, adjust as needed

				if (selectedFile && selectedFile.size > maxSizeInBytes) {
					// eslint-disable-next-line no-alert
					alert(
						'File size exceeds the allowed limit. Please select a smaller file.',
					);
					// Reset the file input to clear the selection
					$(event.target).val('');
				} else {
					// Continue with CKEditor's default behavior
					// Trigger CKEditor's code to handle the file upload
					// For example, you can trigger a click event on the CKEditor button
					const ckButton = $('.ck-file-dialog-button button');
					if (ckButton.length) {
						ckButton.click();
					}
				}
			},
		);


		
			fileInput.on('change', (e) => {
				console.log(e, 222222);
			})

		
</script>